<template>
  <el-card style="max-width: 500px; margin: 0 auto;">
    <h2>个人信息</h2>
    <el-descriptions border column="1">
      <el-descriptions-item label="学号">{{ user.stuId }}</el-descriptions-item>
      <el-descriptions-item label="姓名">{{ user.name }}</el-descriptions-item>
      <el-descriptions-item label="邮箱">{{ user.email }}</el-descriptions-item>
      <el-descriptions-item label="电话">{{ user.phone }}</el-descriptions-item>
      <el-descriptions-item label="积分">{{ user.point }}</el-descriptions-item>
    </el-descriptions>
  </el-card>

  <el-card style="max-width: 900px; margin: 30px auto 0;">
    <h2>管理员公告</h2>
    <el-table :data="announcements" style="width: 100%; margin-bottom: 20px;">
      <el-table-column prop="id" label="公告ID" width="90" />
      <el-table-column prop="title" label="标题" />
      <el-table-column prop="updateTime" label="更新时间" />
      <el-table-column prop="adminId" label="管理员ID" width="120" />
    </el-table>
  </el-card>

  <el-card style="max-width: 900px; margin: 30px auto 0;">
    <h2>组织通知</h2>
    <el-table :data="informs" style="width: 100%">
      <el-table-column prop="id" label="通知ID" width="90" />
      <el-table-column prop="title" label="标题" />
      <el-table-column prop="updateTime" label="更新时间" />
      <el-table-column prop="orgId" label="组织ID" width="120" />
    </el-table>
  </el-card>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { ElMessage } from 'element-plus'
import axios from 'axios'

const stuId = localStorage.getItem('loginId')
const user = ref({
  stuId: '',
  name: '',
  email: '',
  phone: '',
  point: 0
})
const announcements = ref([])
const informs = ref([])

const getStudentInfo = async () => {
  try {
    const res = await axios.get(`http://localhost:8080/student/getStudent/${stuId}`)
    if (res.data && res.data.code === 200 && res.data.data) {
      user.value = res.data.data
    } else {
      ElMessage.error(res.data && res.data.msg ? res.data.msg : '获取信息失败')
    }
  } catch (e) {
    ElMessage.error('获取信息失败')
  }
}

const fetchAnnouncements = async () => {
  try {
    const res = await axios.get('http://localhost:8080/student/getAllAnnouncements')
    console.log('管理员公告:', res.data)
    if (res.data && res.data.code === 200) {
      announcements.value = res.data.data || []
    } else {
      announcements.value = []
      ElMessage.error(res.data && res.data.msg ? res.data.msg : '获取管理员公告失败')
    }
  } catch (e) {
    ElMessage.error('获取管理员公告失败')
  }
}

const fetchInforms = async () => {
  try {
    const res = await axios.get('http://localhost:8080/student/getAllInforms')
    console.log('组织通知:', res.data)
    if (res.data && res.data.code === 200) {
      informs.value = res.data.data || []
    } else {
      informs.value = []
      ElMessage.error(res.data && res.data.msg ? res.data.msg : '获取组织通知失败')
    }
  } catch (e) {
    ElMessage.error('获取组织通知失败')
  }
}

onMounted(() => {
  getStudentInfo()
  fetchAnnouncements()
  fetchInforms()
})
</script>